import React from "react";
import { List, Tag, Button, Space } from "antd";
import { ClockCircleOutlined, CheckCircleOutlined } from "@ant-design/icons";
import type { HomeworkInfo } from "../../../../../types";

const CourseAssignments: React.FC = () => {
  const mockHomework: HomeworkInfo[] = [
    {
      id: "1",
      title: "第一次作业",
      courseId: "c1",
      deadline: "2024-03-20",
      description: "完成课程项目的需求分析文档",
      status: "pending",
    },
    {
      id: "2",
      title: "第二次作业",
      courseId: "c1",
      deadline: "2024-04-01",
      description: "完成项目的概要设计文档",
      status: "submitted",
    },
  ];

  const getStatusTag = (status: HomeworkInfo["status"]) => {
    switch (status) {
      case "pending":
        return <Tag color="warning">待提交</Tag>;
      case "submitted":
        return <Tag color="processing">已提交</Tag>;
      case "graded":
        return <Tag color="success">已批改</Tag>;
      default:
        return null;
    }
  };

  return (
    <List
      itemLayout="horizontal"
      dataSource={mockHomework}
      renderItem={(item) => (
        <List.Item
          actions={[
            <Button key="view" type="link">
              查看详情
            </Button>,
          ]}
        >
          <List.Item.Meta
            title={item.title}
            description={
              <Space>
                {getStatusTag(item.status)}
                <span>
                  <ClockCircleOutlined /> 截止日期：{item.deadline}
                </span>
                {item.score && (
                  <span>
                    <CheckCircleOutlined /> 得分：{item.score}
                  </span>
                )}
              </Space>
            }
          />
        </List.Item>
      )}
    />
  );
};

export default CourseAssignments;
